<!DOCTYPE html>
<html>
  {% include 'header.html' %}
  <body>
    <div class="create">
      
      <h4>Change Pizza Status</h4>
      <h5>Current Status: <b>{{ myFunc('p1zzA') }}</b></h5><br/>
      <hr/>
      <!-- START FORM -->
        <div class="row">
          <form class="col s12" action="submitPizza" method="POST">
            <!-- State -->
              <div class="row">
                <div class="input-field col s12">
                  <select name="state">
                    <option value="" disabled selected>Choose pizza state</option>
                    <option value="production">Production</option>
                    <option value="freezing">Freezing</option>
                    <option value="packaging">Packaging</option>
                    <option value="distribution">Distribution</option>
                  </select>
                </div>
              </div>
              <!-- Timestamp/Date -->
              <div class="row">
                <div class="input-field col s6">
                  <input placeholder="Timestamp" name="timestamp" type="text" >
                </div>
                <div class="input-field col s6">
                  <input placeholder="Date" name="date" type="text" >
                </div>
              </div>
              <input class="waves-light btn our-colour" type="submit" value="Submit" name="">
              <input  onclick="location.href='/changeOwner/wholesaler';" class="waves-light btn our-colour" type="button" value="Transfer Ownership" style="color: white;"  name="">
          </form>
        </div>
      <!-- END FORM -->
    </div>
    <br> 
    <div class="transactions">
      <h4>Pizza Transactions</h4>
      <hr/>
      <!-- START TABLE -->
      <table>
        <thead>
          <tr>
              <th>Transaction ID</th>
              <th>New Owner</th>
              <th>Timestamp</th>
          </tr>
        </thead>
        <tbody>
          {% for arr in transactions %}
          <tr>
            <td>{{ arr['transactionId'] }}</td>
            <td>{{ myOwnerFunc(arr['newOwner']) }}</td>
            <td>{{ myChangeFunc(arr['timestamp']) }}</td>
          </tr>
          {% endfor %}
        </tbody>
      </table>
      <!-- END TABLE -->
    </div>
  </body>
</html>

<script>
  var d = new Date(); // for now
  var h = d.getHours(); // => 9
  var m = d.getMinutes(); // =>  30
  var s = d.getSeconds(); // => 51
  var dd = d.getDate();
  var mm = d.getMonth()+1;
  var yyyy = d.getFullYear();
  if(dd<10) {
    dd = '0'+dd
  } 

  if(mm<10) {
    mm = '0'+mm
  }
  var today = dd + '/' + mm + '/' + yyyy;
  var timeStr = h+":"+m+":"+s
  document.getElementsByName("timestamp")[0].value = timeStr;
  document.getElementsByName("date")[0].value = today;
  
  function convertDateTime(value)
  { 
    var d = new Date(value); // for now
    var h = d.getHours(); // => 9
    var m = d.getMinutes(); // =>  30
    var s = d.getSeconds(); // => 51
    var dd = d.getDate();
    var mm = d.getMonth()+1;
    var yyyy = d.getFullYear();
    return yyyy;
  }
</script>
